---
title: "svg path · RUAL Documentation"
description: "A path element, to define an arbitrary shape."
canonical: https://docs.rual.nl/block-types/state ui/state_path
language: en
---

# svg path

This block is part of the [`state ui`](https://docs.rual.nl/block-types/state%20ui) group and was last modified in core [`v13.0.7`](https://docs.rual.nl/core-versions/130007).

### Parent Requirements

This block requires specific parent elements: `state_svg`. Ensure this block is placed within the appropriate parent context.

A path element, to define an arbitrary shape.

- Data (D) required `value` The path data of the SVG element.

- class `uiclass` Assigns a CSS class to the element. • Hidden when unused

- style `uistyle` Applies inline CSS style to the element • Hidden when unused

- attributes `uiattributes` Adds custom attributes to the element. • Hidden when unused

- state `state` Returns the element to the frontend state.

| `path` |
| --- |
| `svg shape` |

A typical wiring for [SVG Path](https://docs.rual.nl/block-types/state%20ui/state_path): [value](https://docs.rual.nl/block-types/value/value_default) feeds the `data` pin; the `state` out pin feeds [get component child](https://docs.rual.nl/block-types/state%20actions/state_component_get_child).

![Studio canvas example for the SVG Path block: typical wiring for SVG Path.](https://docs.rual.nl/canvas-examples/state_path.png)

### Version history

Introduced in [`v13.0.7`](https://docs.rual.nl/core-versions/130007).